import React, {Component} from 'react';

import {
    StyleSheet,
    Text,
    View,
    Platform,
    FlatList,
    Dimensions,
    TouchableOpacity,
    Image,
    ActivityIndicator,
    DeviceEventEmitter, ScrollView,
} from 'react-native';

import HttpUtils from '../../utils/HttpUtils';
import HttpUrls from '../../utils/HttpUrls';
import Constant from '../../utils/Constant'; //全局变量
import Header from '../../components/header';
import Loading from '../../utils/Loading';
import NoData from '../../utils/NoData';
import {
    getCarRegisterDate,
    getCheckStatus,
    getImgUrl, getMileFormat, getPerm,
    getPriceFormat,
    getPurchaseType,
    getStoreStatus
} from '../../utils/ComFunction';
import RegionPickerView from "../../components/Tool/RegionAllPickerView";
import AndroidModule from "../../utils/AndroidConnent";
import AsyncImage from "../../components/image/AsyncImage";
import {CarSaleStatus, PermissionType} from "../../utils/Enum";
import {ToastToUser} from "../../utils/CustomToast";

const isIos = Platform.OS == 'ios';
const screenW = Dimensions.get('window').width;
const screenH = Dimensions.get('window').height;

let navigation;

export default class SeekingCarPage extends Component {
    constructor(props) {
        super(props);

        let addCarPerm = getPerm(PermissionType.Permission_EnableAddCar)

        this.state = {
            addCarPerm,
            showCityPicker: false, // 城市弹出

            showReadMore: false,

            carNumber: 0,
            carList: [],
            isRefresh: false,
            showFoot: 0, // 控制foot， 0：隐藏footer  1：已加载完成,没有更多数据   2 ：显示加载中
            pageNo: 1,
            pageSize: 20,

            // 搜索条件
            areaId: null,
            brandId: null,
            mileageMin: null,
            mileageMax: null,
            registerDateBegin: null,
            registerDateEnd: null,
            carPriceMin: null,
            carPriceMax: null,
            carOutColor: [],
            carOutColorPr: [],
            carInColor: [],
            carInColorPr: [],
            title: null,

            filterShowList: [], // 条件列表

            isFranchisee: Constant.userInfo.isFranchisee,

        };
    }

    componentDidMount() {

        // 筛选条件监听
        this.SeekMoreFilterPage = DeviceEventEmitter.addListener('SeekMoreFilterPage', (data) => {
            if(data.type === 'seekMoreFilter'){
                this.addAllFilterShow(data)
            }
        })

        // 品牌事件监听
        this.selectBrandResult = DeviceEventEmitter.addListener('selectBrandResult', (result) => {
            if (result && result.from === 'carListPage') {
                this.formatBrand(result)
            }
        })

        this.refreshData();
    }

    componentWillUnmount() {
        if (this.SeekMoreFilterPage) { // 移除筛选条件监听
            this.SeekMoreFilterPage.remove();
        }
        if (this.selectBrandResult) {
            this.selectBrandResult.remove();
        }
    }

    render() {
        navigation = this.props.navigation;
        return (
            <View style={styles.container}>
                <Header navigation={navigation} Title="选车推荐" RightButton={() => this.renderRightButton()} />

                {/* 搜索 */}
                {/*{this.renderFilter()}*/}

                {/* 条件清除 */}
                {/*{this.renderFilterShow()}*/}

                <View style={{ backgroundColor: '#fff'}}>
                    <Text style={{height: 30, lineHeight: 30, paddingHorizontal: 15}}>共找到{this.state.carNumber}辆</Text>
                </View>

                {/* 列表数据 */}
                {this.renderCarList()}

                <RegionPickerView
                    show={this.state.showCityPicker}
                    mode={'pc'}
                    hide={() => {
                        this.setState({
                            showCityPicker: false
                        })
                    }}
                    selectArea={(item) => {
                        console.log(item);
                        let address = item.provinceName + item.cityName
                        let areaId = item.cityId
                        if(item.cityId === 0){ // 不限
                            areaId = item.provinceId
                        }
                        let addressObj = {
                            title: address,
                            key: 'address',
                            value: areaId
                        }
                        this.addRenderFilter(addressObj)
                        this.setState({
                            showCityPicker: false,
                            areaId: areaId,
                        }, function () {
                            this.refreshData()
                        })
                    }}
                />

                <Loading onRef={ref => (this.Loading = ref)} />
            </View>
        );
    }

    // 右侧搜索图标
    renderRightButton(){
        return (
            <View style={styles.topRightContain}>
                {
                    this.state.addCarPerm
                        ?
                        <TouchableOpacity
                            style={{ marginRight: 15}}
                            onPress={() => {
                                navigation.navigate('PublishCarPage', {backPage: 'SeekingCarPage'})
                            }}>
                            <Image style={styles.iconImg} source={require('source/image/seekCenter/seek_add_icon1.png')}></Image>
                        </TouchableOpacity>
                        :
                        null
                }
            </View>
        );
    };

    renderCarList() {
        return (
            <FlatList
                data={this.state.carList}
                renderItem={this.renderCarItem.bind(this)}
                keyExtractor={item => item.carId + ''}
                style={styles.list}
                extraData={this.state}
                ListFooterComponent={this.renderFooter.bind(this)}
                onEndReached={this._onEndReached.bind(this)}
                onEndReachedThreshold={0.2}
                onRefresh={this.refreshData}
                ListEmptyComponent={this.renderEmpty.bind(this)}
                refreshing={this.state.isRefresh}
            />
        )
    }

    renderCarItem({ item, index }) {
        // 判断是否应该显示推荐按钮
        const shouldShowRecommendButton = !item.sellerQuotationUserId ||
            item.sellerQuotationUserId === '' ||
            item.sellerQuotationUserId === Constant.userInfo.userId;

        return (
            <View
                style={styles.cardContainer}
            >
                <View style={styles.carContainer}>

                    <AsyncImage
                        source={{ uri: getImgUrl(item.mainPic) }}
                        defaultSource={require('source/image/icon_car_default.png')}
                        style={styles.carImage}
                        resizeMode="cover"
                    />

                    <View style={styles.infoContainer}>
                        <View>
                            <Text style={styles.carName} numberOfLines={2} ellipsizeMode='tail'>{item.seriesName + ' ' + item.speciesName}</Text>

                            <Text style={styles.subInfo}>
                                {this.getSubCarInfo(item)}
                            </Text>
                        </View>

                        <View style={{flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center'}}>
                            <Text style={styles.price}>{this.getCarPrice(item)}</Text>
                            <Text style={{fontSize: 12}}>采购:{item.purchaserName}</Text>
                        </View>

                        {/* 选车推荐按钮 */}
                        {shouldShowRecommendButton && (
                            <TouchableOpacity style={{flexDirection: 'row'}}  activeOpacity={0.8}
                                              onPress={() => {
                                                  this.consultOnline(item)
                                              }}>
                                <Text style={{width: '50%'}}></Text>
                                <Text style={{
                                    width: '50%',
                                    backgroundColor: '#FFA500',
                                    padding: 3,
                                    fontSize: 12,
                                    textAlign: 'center',
                                    height: 23,
                                    paddingHorizontal: 15,
                                    borderRadius: 4,
                                    color: '#fff',
                                }}>推荐该车源</Text>
                            </TouchableOpacity>
                        )}

                    </View>
                </View>

            </View>
        )

    }

    getCarPrice(item) {
        //联盟商家车源显示“一口价”，加盟商车源显示“展厅标价”
        //isFranchisee：是否加盟商 0否1是
        return this.state.isFranchisee == 1 ? '挂牌价:' + getPriceFormat(item.listPrice) : '一口价:' + getPriceFormat(item.markedPrice)
    }

    getSubCarInfo(item) {

        if (item.carType == 1) {//新车

            return '新车指导价：' + getPriceFormat(item.guidePrice)
        } else {
            return getCarRegisterDate(item.registerDate) + ' ' + getMileFormat(item.mileage)
        }
    }

    // 搜索过滤
    renderFilter() {
        return (
            <View style={styles.filterContain}>
                <TouchableOpacity
                    style={styles.filterItem}
                    onPress={() => {
                        this.setState({
                            showCityPicker: true
                        })
                    }}>
                    <Text style={styles.filterText}>城市</Text>
                    <Image style={styles.filterImg} source={require('source/image/comm/down_small_gray.png')}></Image>
                </TouchableOpacity>

                <TouchableOpacity
                    style={styles.filterItem}
                    onPress={() => {
                        let params = { selectLevel: 2, from: 'carLIstPage' }
                        AndroidModule.selectBrand(params, (error, result) => {})
                    }}>
                    <Text style={styles.filterText}>品牌</Text>
                    <Image style={styles.filterImg} source={require('source/image/comm/down_small_gray.png')}></Image>
                </TouchableOpacity>

                <TouchableOpacity
                    style={styles.filterItem}
                    onPress={() => {
                        navigation.navigate('SeekMoreFilterPage', {
                            fromPage: 'carLIstPage',

                            mileageMin: this.state.mileageMin,
                            mileageMax: this.state.mileageMax,
                            registerDateBegin: this.state.registerDateBegin,
                            registerDateEnd: this.state.registerDateEnd,
                            carPriceMin: this.state.carPriceMin,
                            carPriceMax: this.state.carPriceMax,
                            carOutColor: this.state.carOutColor,
                            carInColor: this.state.carInColor,
                        })
                    }}>
                    <Text style={styles.filterText}>更多</Text>
                    <Image style={styles.filterImg} source={require('source/image/comm/down_small_gray.png')}></Image>
                </TouchableOpacity>
            </View>
        )
    }

    formatBrand(result) {

        console.log('formatBrand result = ', result)
        let brandId = result.seriesId
        let brandName = result.seriesName
        if(result.brandId === 0){
            return
        }
        if(!result.seriesId || result.seriesId === 0){
            brandId = result.brandId
            brandName = result.brandName
        }
        let brandObj = {
            title: brandName,
            key: 'brand',
            value: brandId
        }
        this.addRenderFilter(brandObj)

        this.setState({
            brandId: brandId,
        }, function () {
            this.refreshData()
        })

    }

    addAllFilterShow(data) {
        let tempList = []
        let resultList = []

        console.log("addAllFilterShow ====",  data)

        let mileShowText = data.mileShowText
        let mileageMin = data.mileageMin
        let mileageMax = data.mileageMax

        if (mileShowText === '不限') {
            mileageMin = null
            mileageMax = null
        } else {
            tempList.push({
                title: mileShowText,
                key: 'mileage',
                value: 0
            })
        }

        let ageShowText = data.ageShowText
        let registerDateBegin = data.registerDateBegin
        let registerDateEnd = data.registerDateEnd

        if (ageShowText === '不限') {
            registerDateBegin = null
            registerDateEnd = null
        } else {
            tempList.push({
                title: ageShowText,
                key: 'carAge',
                value: 0
            })
        }

        // 价格
        let priceShowText = data.priceText
        let carPriceMin = data.carPriceMin
        let carPriceMax = data.carPriceMax
        if(priceShowText === '不限'){
            carPriceMin = null
            carPriceMax = null
        }else {
            tempList.push({
                title: priceShowText,
                key: 'price',
                value: 0
            })
        }

        // 颜色
        if(data.carOutColor && data.carOutColor.length > 0){
            data.carOutColor.map((item, index) => {
                let tempListItem = {
                    title: item,
                    key: 'carOutColor',
                    value: item
                }
                tempList.push(tempListItem)
            })
        }

        // 颜色
        if(data.carInColor && data.carInColor.length > 0){
            data.carInColor.map((item, index) => {
                let tempListItem = {
                    title: item,
                    key: 'carInColor',
                    value: item
                }
                tempList.push(tempListItem)
            })
        }

        let filterShowList = this.state.filterShowList
        if (filterShowList.length === 0) {
            resultList = tempList
        } else {
            let temp = [];
            for (let i = 0; i < filterShowList.length; i++) {
                if (filterShowList[i].key === 'keyword' || filterShowList[i].key === 'brand') {
                    temp.push(filterShowList[i])

                }
            }
            resultList = temp.concat(tempList)

        }

        resultList.push({ key: 'clear' })

        this.setState({
            filterShowList: resultList,
            // 公里数
            mileageMin: mileageMin,
            mileageMax: mileageMax,

            // 车龄
            registerDateBegin: registerDateBegin,
            registerDateEnd: registerDateEnd,

            carPriceMin: carPriceMin,
            carPriceMax: carPriceMax,

            carOutColor: data.carOutColor,
            carOutColorPr: data.carOutColorPr,

            carInColor: data.carInColor,
            carInColorPr: data.carInColorPr,

        })

        this.refreshData();
    }

    // 条件清除
    renderFilterShow() {
        return (
            <View style={styles.filterShowContain}>
                {this.state.filterShowList.map((item, index) => {
                    if (item.key == 'clear') {
                        return (
                            <TouchableOpacity
                                key={`clear-${index}`}
                                style={styles.filterShowItem}
                                onPress={() => {
                                    this.clearFilterShow()
                                }}>
                                <Image style={styles.filterShowClearImg} source={require('source/image/comm/btn_clear_history.png')}></Image>
                                <Text style={styles.filterShowText}>清空</Text>

                            </TouchableOpacity>
                        )
                    } else {
                        return (
                            <TouchableOpacity
                                key={`clear1-${index}`}
                                style={styles.filterShowItem}
                                onPress={() => {
                                    this.removeFilterShow(item, index)
                                }}>
                                <Text style={styles.filterShowText}>{item.title}</Text>
                                <Image style={styles.filterShowCloseImg} source={require('source/image/comm/icon_close.png')}></Image>
                            </TouchableOpacity>
                        )
                    }

                })
                }
            </View>
        )
    }

    addRenderFilter(filterModel) {
        let filterShowList = this.state.filterShowList
        let clear = {
            key: 'clear',
        }
        if (filterShowList.length == 0) {
            filterShowList.push(filterModel)
            filterShowList.push(clear)
        } else {
            let isExist = false
            for (let i = 0; i < filterShowList.length; i++) {
                if (filterShowList[i].key == filterModel.key) {
                    isExist = true
                    filterShowList[i] = filterModel
                }
            }
            if (!isExist) {
                filterShowList.splice(filterShowList.length - 2, 0, filterModel);
            }
        }

        this.setState({
            filterShowList: filterShowList
        })
    }

    // 条件清除
    clearFilterShow() {
        this.setState({
            filterShowList: [],
            areaId: null,
            brandId: null,
            mileageMin: null,
            mileageMax: null,
            registerDateBegin: null,
            registerDateEnd: null,
            carPriceMin: null,
            carPriceMax: null,
            carOutColor: [],
            carInColor: [],
            title: null
        }, function () {
            this.refreshData()
        })
    }

    // 删除条件
    removeFilterShow(item, index) {
        let filterShowList = this.state.filterShowList
        let temp = []
        for (let i = 0; i < filterShowList.length; i++) {
            if (i !== index) {
                temp.push(filterShowList[i])
            }
        }

        if (item.key === 'address') {
            this.setState({
                areaId: null
            })
        }
        if (item.key === 'brand') {
            this.setState({
                brandId: null
            })
        }
        if(item.key === 'mileage'){
            this.setState({
                mileageMin: null,
                mileageMax: null
            })
        }
        if(item.key === 'carAge'){
            this.setState({
                registerDateBegin: null,
                registerDateEnd: null
            })
        }
        if(item.key === 'price'){
            this.setState({
                carPriceMin: null,
                carPriceMax: null,
            })
        }
        if(item.key === 'title'){
            this.setState({
                title: null,
            })
        }
        if(item.key === 'carOutColor'){
            const index = this.state.carOutColor.indexOf(item.value);
            if (index > -1) {
                const newCarOutColor = [...this.state.carOutColor];
                newCarOutColor.splice(index, 1);
                this.setState({ carOutColor: newCarOutColor });
            }
        }
        if(item.key === 'carInColor'){
            const index = this.state.carInColor.indexOf(item.value);
            if (index > -1) {
                const newCarInColor = [...this.state.carInColor];
                newCarInColor.splice(index, 1);
                this.setState({ carInColor: newCarInColor });
            }
        }

        if(temp.length === 1){
            temp = []
        }

        this.setState({
            filterShowList: temp
        }, function () {
            this.refreshData()
        })
    }

    handleTextLayout = (event) => {
        const { height } = event.nativeEvent.layout;
        const fontSize = 13; // 根据实际字体大小调整
        const lineHeight = fontSize * 1.2; // 假设行高为字体大小的1.2倍
        console.log('handleTextLayout', height, lineHeight);
        // 判断文本是否超过一行
        if (height > lineHeight) {
            this.setState({ showReadMore: true });
        } else {
            this.setState({ showReadMore: false });
        }
    };

    renderEmpty() {
        return <NoData Desc="暂无数据" style={{marginTop: gREM(100)}} />;
    }

    //刷新数据
    refreshData = () => {
        this.setState(
            {
                isRefresh: true,
                pageNo: 1,
                carList: [],
            },
            function () {
                this.getCarList();
            },
        );
    };

    // 底部加载更多
    renderFooter() {
        if (this.state.showFoot === 1) {
            return null;
        } else if (this.state.showFoot === 2) {
            return (
                <View style={styles.footer}>
                    <ActivityIndicator size="small" color="#999999" />
                    <Text style={styles.loadMoreTextStyle}>正在加载更多数据...</Text>
                </View>
            );
        } else if (this.state.showFoot === 0) {
            return null;
        }
    }

    _onEndReached() {
        if(this.state.carList.length == 0){
            return null;
        }
        //如果是正在加载中或没有更多数据了，则返回
        if (this.state.showFoot !== 0) {
            return null;
        }
        //底部显示正在加载更多数据
        this.setState(
            {
                showFoot: 2,
                pageNo: this.state.pageNo + 1,
            },
            function () {
                this.getCarList();
            },
        );
    }

    consultOnline(item) {
        console.log('consultOnlineItem', item)
        const { id, merchantId, userId = 0 } = this.props.route.params || {};
        console.log('consultOnline', merchantId, userId)

        let param = {
            carId: item.carId,
            buyerMerchantId: merchantId, // 买方
            buyerUserId: userId, // 买手用户id
            sellerMerchantId: Constant.userInfo.merchantId, // 卖方
            source: 2,
            assignSellerUserId: Constant.userInfo.userId, // 推荐车传入判断是否可以推荐
            // conversationType: 1,
        }

        console.log('consultOnline——param', param)

        if (this.Loading) {
            this.Loading.show();
        }

        HttpUtils.postRequest(HttpUrls.quotationConsult, param)
            .then((result) => {
                if (this.Loading) {
                    this.Loading.hide();
                }
                console.log('quotationConsult——result', result)
                if (result.code === 0) {
                    if(result.data.sellerUserId != Constant.userInfo.userId){
                        ToastToUser('您不是此车跟进人')
                        return
                    }

                    let imPost = {
                        carPurchaseId: id,
                        imGroupId: result.data?.imGroupId || null,
                        carId: item.carId,
                    }
                    HttpUtils.postRequest(HttpUrls.addImInfo, imPost)
                        .then((result) => {
                            console.log('addImInfo====', result)
                        })



                    setTimeout(() => {
                        navigation.navigate('MessageChat', {
                            imGroupId: result.data.imGroupId,
                            carId: item.carId,
                            carPurchaseId: id,
                            quotationRecordId: result.data.quotationRecordId
                        })
                    }, 500);

                } else {
                    ToastToUser(result.msg + '')
                }

            })
            .catch((error) => {
                if (this.Loading) {
                    this.Loading.hide();
                }
            });
    }

    // 获取车辆列表
    getCarList() {

        let { id } = this.props.route.params || {};

        let param = {
            pageNo: this.state.pageNo,
            pageSize: this.state.pageSize,
            merchantId:  Constant.userInfo.merchantId || 0,
        };

        if(id && id > 0){
            param.carPurchaseId = id;
        }

        // if(this.state.areaId){
        //     param.areaId = this.state.areaId;
        // }
        // if(this.state.brandId){
        //     param.brandId = this.state.brandId;
        // }
        // if(this.state.mileageMin){
        //     param.carMileageMin = this.state.mileageMin;
        // }
        // if(this.state.mileageMax){
        //     param.carMileageMax = this.state.mileageMax;
        // }
        // if(this.state.registerDateBegin){
        //     param.carAgeMin = this.state.registerDateBegin;
        // }
        // if(this.state.registerDateEnd){
        //     param.carAgeMax = this.state.registerDateEnd;
        // }
        // if(this.state.carPriceMin){
        //     param.carPriceMin = this.state.carPriceMin;
        // }
        // if(this.state.carPriceMax){
        //     param.carPriceMax = this.state.carPriceMax;
        // }
        // if(this.state.carOutColor && this.state.carOutColor.length > 0){
        //     param.carOutColor = this.state.carOutColor;
        // }
        // if(this.state.carInColor && this.state.carInColor.length > 0){
        //     param.carInColor = this.state.carInColor;
        // }
        // if(this.state.title){
        //     param.title = this.state.title;
        // }

        HttpUtils.postRequest(HttpUrls.carPurchaseSearchCars, param)
            .then(result => {
                console.log('carPurchaseSearchCars =======', result)
                let data = result.data;
                if (data) {
                    let resultList = data.resultList;
                    if (resultList && resultList.length > 0) {
                        this.setState({
                            carList: this.state.carList.concat(resultList),
                            isRefresh: false,
                            showFoot: 1,
                            carNumber: data.totalSize || 0,
                        });
                        setTimeout(() => {
                            this.setState({
                                showFoot: resultList.length >= 20 ? 0 : 1,
                            });
                        }, 200);
                    } else {
                        this.setState({
                            showFoot: 1,
                            isRefresh: false,
                        });
                    }
                } else {
                    this.setState({
                        showFoot: 1,
                        isRefresh: false,
                    });
                }
            })
            .catch(error => {});
    }

}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#F9F9F9',
    },

    // 选项过滤
    filterContain: {
        width: '100%',
        height: 46,
        backgroundColor: '#fff',
        flexDirection: 'row',
        alignItems: 'center',
        justifyContent: 'space-between',
        paddingHorizontal: 5,
    },
    filterItem: {
        flex: 1,
        marginHorizontal: 2,
        height: '100%',
        flexDirection: 'row',
        justifyContent: 'center',
        alignItems: 'center',
    },
    filterImg: {
        width: 20,
        height: 20,
    },
    filterText: {
        fontSize: 14,
        color: '#666666'
    },

    // 列表
    list: {
        flex: 1,
    },
    cardContainer: {
        backgroundColor: '#fff',
        marginTop: 10,
        paddingLeft: 15,
        paddingRight: 15,
        paddingTop: 10,
        paddingBottom: 10,
        flexDirection: 'column',
    },
    carContainer: {
        flexDirection: 'row',
        alignItems: 'center'
    },
    carImage: {
        width: 130,
        height: 90,
        borderRadius: 4,
        backgroundColor: '#f5f5f5',
    },
    infoContainer: {
        flex: 1,
        marginLeft: 10,
        height: 110,
        flexDirection: 'column',
        justifyContent: 'space-between'
    },
    carName: {
        fontSize: 14,
        fontWeight: '500',
        marginBottom: 5,
        color: '#333',
    },
    subInfo: {
        fontSize: 12,
        color: '#999999',
        marginTop: 3,
    },
    price: {
        fontSize: 14,
        color: '#ED542E',
    },

    statusContainer: {
        flexDirection: 'row',
        flexWrap: 'wrap',
        marginTop: 6
    },
    statusTag: {
        paddingHorizontal: 8,
        paddingVertical: 4,
        marginRight: 8,
        borderRadius: 2,
        backgroundColor: '#F4F4F4',
        justifyContent: 'center',
        alignItems: 'center'
    },
    statusText: {
        fontSize: 10,
    },
    tagText: {
        fontSize: 12,
        color: '#666'
    },


    // 底部加载更多
    footer: {
        flexDirection: 'row',
        height: 40,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#f6f6f6',
    },
    loadMoreTextStyle: {
        fontSize: 14,
        color: '#999999',
        marginStart: 10,
    },

    // 筛选
    filterShowContain: {
        flexDirection: 'row',
        flexWrap: 'wrap',
        backgroundColor: '#fff',
        paddingHorizontal: 15
    },
    filterShowItem: {
        flexDirection: 'row',
        alignItems: 'center',
        justifyContent: 'center',
        // height: 30,
        backgroundColor: '#f6f6f6',
        borderRadius: 4,
        paddingHorizontal: 5,
        paddingVertical: 5,
        marginRight: 10,
        marginBottom: 5
    },
    filterShowText: {
        fontSize: 10,
        color: '#696969'
    },
    filterShowCloseImg: {
        width: 10,
        height: 10,
        marginLeft: 2
    },
    filterShowClearImg: {
        width: 12,
        height: 12,
        marginRight: 2,
        resizeMode: 'contain'
    },

    // 右侧搜索样式
    topRightContain: {
        // paddingRight: 12,
        width: '100%',
        height: '100%',
        flexDirection: 'row',
        justifyContent: 'flex-end',
        alignItems: 'center',
    },
    iconImg: {
        width: 24,
        height: 24
    },

});
